11-3 {eO@

JavaScript 是在用戶端的電腦執行,但是有些情況下,我們不希望使用者抄襲我們精心製作出來的程式碼,因此就有必要對 JavaScript 程式碼進行簡單的保護或加密。

首先,我們可以使用 escape() 和 unescape() 來對 JavaScript 程式碼來進行簡單的加密與解密,請看下列「每日一句」的範例:

Example(escapeEncode01.htm):

在此範例中,只要重載一次,就會以亂數挑選一句格言。若是選擇檢視原始檔,則只會看到一堆亂碼,如下:

原始檔(escapeEncode01.htm):(灰色區域按兩下即可拷貝)
<html>
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=big5">
</head>

<body>
<h2 align=center>保護網頁內容:以 escape() 來加密</h2>
<hr>

<script>
eval(unescape("text%20%3D%20new%20Array%28%29%3B%0D%0Ai%20%3D%200%3B%0D%0Atext%5Bi++%5D%3D%22If%20you%20don%27t%20set%20aside%20time%20for%20exercise%2C%3Cbr%3Eyou%27ll%20set%20aside%20time%20for%20illness.%22%3B%0D%0Atext%5Bi++%5D%3D%22%u4E0D%u7BA1%u4F60%u5011%u76F8%u611B%u7684%u6642%u9593%u6709%u591A%u9577%u6216%u591A%u77ED%uFF0C%3Cp%3E%u82E5%u4F60%u5011%u80FD%u59CB%u7D42%u6EAB%u67D4%u5730%u76F8%u5F85%uFF0C%3Cp%3E%u90A3%u9EBC%uFF0C%u6240%u6709%u7684%u6642%u523B%u90FD%u5C07%u662F%u4E00%u7A2E%u7121%u7455%u7684%u7F8E%u9E97%uFF0C%3Cp%3E%u82E5%u4E0D%u5F97%u4E0D%u5206%u96E2%uFF0C%u4E5F%u8981%u597D%u597D%u7684%u8AAA%u8072%u518D%u898B%uFF0C%3Cp%3E%u4E5F%u8981%u5728%u5FC3%u88E1%u5B58%u8457%u611F%u8B1D%uFF0C%3Cp%3E%u611F%u8B1D%u4ED6%u7D66%u4E86%u4F60%u4E00%u4EFD%u8A18%u61B6%u3002%3Cbr%3E%3Cbr%3E%u9577%u5927%u4E86%u4EE5%u5F8C%uFF0C%u4F60%u624D%u6703%u77E5%u9053%uFF0C%3Cp%3E%u5728%u9A40%u7136%u56DE%u9996%u7684%u524E%u90A3%uFF0C%3Cp%3E%u6C92%u6709%u6028%u6068%u7684%u9752%u6625%u624D%u6703%u4E86%u7121%u907A%u61BE%uFF0C%3Cp%3E%u5982%u5C71%u5CA1%u4E0A%u90A3%u8F2A%u975C%u975C%u7684%u6EFF%u6708%u3002%3Cbr%3E%3Cbr%3E%u5E2D%u6155%u84C9%u2027%u7121%u6028%u7684%u9752%u6625%22%3B%0D%0Atext%5Bi++%5D%3D%22%u5357%u65B9%u6709%u4F73%u4EBA%20%u7D55%u4E16%u800C%u7368%u7ACB%3Cp%3E%u4E00%u9867%u50BE%u4EBA%u57CE%20%u518D%u9867%u50BE%u4EBA%u570B%22%3B%0D%0Atext%5Bi++%5D%20%3D%20%22%uFF5E%uFF5E%20%u3000%u4E00%u6B21%u7684%u651C%u624B%3Cp%3E%20%u3000%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%u3000%20%20%20%20%u4E00%u751F%u7684%u8A93%u7D04%u3000%uFF5E%uFF5E%22%3B%0D%0Atext%5Bi++%5D%20%3D%22%u6211%u66FE%u8E0F%u6708%u800C%u53BB%20%u53EA%u56E0%u4F60%u5728%u5C71%u4E2D%3Cp%3E%u800C%u5728%u4ECA%u591C%u8A34%u8AAA%u8457%u7684%u71B1%u6DDA%u88CF%3Cbr%3E%u7336%u898B%u4F60%u5FAE%u7B11%u7684%u9762%u5BB9%3Cp%3E%u53E2%u5C71%u6697%u6697%20%u6211%u83EF%u5E74%u5DF2%u901D%3Cp%3E%u60F3%u6797%u4E2D%u6B21%u6B21%u56DE%u6625%20%u4F9D%u7136%3Cp%3E%u6703%u6709%u5F37%u5065%u7684%u4F60%20%u633D%u6211%u62FE%u7D1A%u800C%u4E0A%3Cp%3E%u800C%u6708%u8272%u5982%u6C34%20%u82B3%u8349%u6DD2%u8FF7%22%3B%0D%0Atext%5Bi++%5D%20%3D%20%22%u5144%u5F1F%u662F%u5148%u5929%u7684%u670B%u53CB%uFF0C%3Cp%3E%u670B%u53CB%u662F%u5F8C%u5929%u7684%u5144%u5F1F.%22%3B%0D%0Atext%5Bi++%5D%20%3D%20%22%u611B%u7684%u53CD%u9762%u4E0D%u662F%u4EC7%u6068%uFF0C%u800C%u662F%u6F20%u4E0D%u95DC%u5FC3%uFF01%22%3B%0D%0Atext%5Bi++%5D%20%3D%20%22%u5982%u4F55%u8B93%u4F60%u9047%u898B%u6211%20%20%u5728%u6211%u6700%u7F8E%u9E97%u7684%u6642%u523B%3Cp%3E%u70BA%u9019%20%20%u6211%u5DF2%u5728%u4F5B%u524D%20%u6C42%u4E86%u4E94%u767E%u5E74%20%u6C42%u7942%u8B93%u6211%u5011%u7D50%u4E00%u6BB5%u5875%u7DE3%3Cp%3E%u4F5B%u65BC%u662F%u628A%u6211%u5316%u4F5C%u4E00%u68F5%u6A39%20%20%u9577%u5728%u4F60%u5FC5%u7D93%u7684%u8DEF%u65C1%20%3Cp%3E%u967D%u5149%u4E0B%u614E%u91CD%u7684%u958B%u6EFF%u4E86%u82B1%20%20%u6735%u6735%u90FD%u662F%u6211%u524D%u4E16%u7684%u76FC%u671B%3Cp%3E%20%20%u7576%u4F60%u8D70%u8FD1%20%20%u8ACB%u4F60%u7D30%u807D%20%u90A3%u986B%u6296%u7684%u8449%u662F%u6211%u7B49%u5F85%u7684%u71B1%u60C5%20%3Cp%3E%20%u800C%u7576%u4F60%u7D42%u65BC%u7121%u8996%u7684%u8D70%u904E%20%20%u5728%u4F60%u8EAB%u5F8C%u843D%u4E86%u4E00%u5730%u7684...%3Cp%3E%u670B%u53CB%u554A%20%20%u90A3%u4E0D%u662F%u82B1%u74E3%20%20%u662F%u6211%u51CB%u96F6%u7684%u5FC3%3Cbr%3E%3Cbr%3E%u5E2D%u6155%u84C9%u2027%u4E00%u7A1E%u958B%u82B1%u7684%u6A39%22%3B%0D%0Atext%5Bi++%5D%20%3D%20%22Draft%20beers%2C%20not%20people.%22%3B%0D%0Atext%5Bi++%5D%20%3D%20%22Of%20all%20the%20things%20I%20lost%2C%20I%20miss%20my%20mind%20most.%22%3B%0D%0Atext%5Bi++%5D%20%3D%20%22Choose%20what%20you%20love%20...%3Cbr%3ELove%20what%20you%20choose.%22%3B%0D%0Atext%5Bi++%5D%20%3D%20%22Rules%20are%20made%20to%20be%20broken.%22%3B%0D%0Atext%5Bi++%5D%20%3D%20%22Waste%20bandwidth%3B%20not%20trees%21%22%3B%0D%0Atext%5Bi++%5D%20%3D%20%22Work%20like%20you%20don%27t%20need%20the%20money.%3Cbr%3ELove%20like%20you%27ve%20never%20been%20hurt.%3Cbr%3EDance%20like%20nobody%27s%20watching.%22%3B%0D%0Atext%5Bi++%5D%20%3D%20%22%u66FE%u7D93%u6EC4%u6D77%u96E3%u70BA%u6C34%uFF0C%3Cbr%3E%u9664%u537B%u5DEB%u5C71%u4E0D%u662F%u96F2%u3002%3Cbr%3E%u53D6%u6B21%u82B1%u53E2%u61F6%u8FF4%u9867%uFF0C%3Cbr%3E%u534A%u7DE3%u4FEE%u9053%u534A%u7DE3%u541B%u3002%3Cbr%3E%3Cbr%3E%u5143%u7A39%u2027%u96E2%u601D%22%3B%0D%0A%20%0D%0Aindex%20%3D%20Math.floor%28Math.random%28%29*text.length%29%3B%09%09//%20%u4EE5%u4E82%u6578%u8A2D%u5B9A%u53E5%u5B50%u7684%u7D22%u5F15%u503C%0D%0Adocument.write%28%22%3CCENTER%3E%3Ctable%20border%3D2%20cellpadding%3D20%20bgcolor%3Dwhite%3E%22%29%3B%0D%0Adocument.write%28%22%3Ctr%3E%3Ctd%3E%3Cb%3E%3Cfont%20size%3D+2%20face%3D%5C%22%u6A19%u6977%u9AD4%2CHelvetical%2CArial%5C%22%20color%3D%23408080%3E%22%29%3B%0D%0Adocument.write%28text%5Bindex%5D%29%3B%0D%0Adocument.write%28%22%3C/font%3E%3C/b%3E%3C/td%3E%3C/tr%3E%3C/table%3E%3C/CENTER%3E%22%29%3B"));
</script>

<hr>
</body>
</html>

但是上述亂碼是由原先工整的程式經由 escape() 編碼的結果,然後經由 unescape() 來得回原先的字串,再由 eval() 來執行之,整個流程可以說明如下:

  1. 先撰寫未加密的原始網頁。(本例為 randomText.htm
  2. 利用 escapeEncodeTest01.htm 來進行 escape() 的編碼。
  3. 將編碼後的字串拷貝到加密後的網頁,但必須經由 unescape() 來轉回原來的程式字串,再經由 eval() 來執行之。然後就大功告成了。
在上述說明中,我們使用了一個好用的網頁來對 JavaScript 程式碼進行 escape() 編碼:

Example(escapeEncodeTest01.htm):

上述範例的原始檔如下:

原始檔(escapeEncodeTest01.htm):(灰色區域按兩下即可拷貝)
<html>
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=big5">
</head>

<body>
<h2 align=center>使用 escape() 與 unescape() 來編碼與解碼</h2>
<hr>

<p>編碼前字串:<textarea rows=3 cols=60 id=text1>
function square(x){
	return(x*x);
}
</textarea>
<p><input type=button value="使用 escape() 進行編碼" onClick="text2.value=escape(text1.value)">
<br>編碼後字串:<textarea rows=3 cols=60 id=text2></textarea>
<p><input type=button value="使用 unescape() 進行解碼" onClick="text3.value=unescape(text2.value)">
<br>解碼後字串:<textarea rows=3 cols=60 id=text3></textarea>

<hr>
</body>
</html>

在上一個範例中,經由 escape() 編碼後,你還是可以由編碼後的字串看到諸如「function」、「square」等有意義的字眼,因此比較容易猜到程式碼的內容。另一種方法,則是先將程式碼進行「平移編碼」(Shift Encoding),再進行 escape 編碼,這時候就看不到有意義的字眼了。範例如下:

Example(shiftEncode01.htm):

上述範例仍是「每日一句」,若檢視原始碼,則只會看到一堆亂碼,完全沒有有意義的字眼在裡面,如下:

原始檔(shiftEncode01.htm):(灰色區域按兩下即可拷貝)
<html>
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=big5">
</head>

<body>
<h2 align=center>保護網頁內容:以 shiftEncode() 及 escape() 來加密</h2>
<hr>

<script src=encode.js></script>
<script>
eval(shiftEncode(unescape("ufyu%21%3E%21ofx%21Bssbz%29*%3C%0E%0Bj%21%3E%211%3C%0E%0Bufyu%5Cj%2C%2C%5E%3E%23Jg%21zpv%21epo%28u%21tfu%21btjef%21ujnf%21gps%21fyfsdjtf-%3Dcs%3Fzpv%28mm%21tfu%21btjef%21ujnf%21gps%21jmmoftt/%23%3C%0E%0Bufyu%5Cj%2C%2C%5E%3E%23%u4E0E%u7BA2%u4F61%u5012%u76F9%u611C%u7685%u6643%u9594%u670A%u591B%u9578%u6217%u591B%u77EE%uFF0D%3Dq%3F%u82E6%u4F61%u5012%u80FE%u59CC%u7D43%u6EAC%u67D5%u5731%u76F9%u5F86%uFF0D%3Dq%3F%u90A4%u9EBD%uFF0D%u6241%u670A%u7685%u6643%u523C%u90FE%u5C08%u6630%u4E01%u7A2F%u7122%u7456%u7685%u7F8F%u9E98%uFF0D%3Dq%3F%u82E6%u4E0E%u5F98%u4E0E%u5207%u96E3%uFF0D%u4E60%u8982%u597E%u597E%u7685%u8AAB%u8073%u518E%u898C%uFF0D%3Dq%3F%u4E60%u8982%u5729%u5FC4%u88E2%u5B59%u8458%u6120%u8B1E%uFF0D%3Dq%3F%u6120%u8B1E%u4ED7%u7D67%u4E87%u4F61%u4E01%u4EFE%u8A19%u61B7%u3003%3Dcs%3F%3Dcs%3F%u9578%u5928%u4E87%u4EE6%u5F8D%uFF0D%u4F61%u624E%u6704%u77E6%u9054%uFF0D%3Dq%3F%u5729%u9A41%u7137%u56DF%u9997%u7685%u524F%u90A4%uFF0D%3Dq%3F%u6C93%u670A%u6029%u6069%u7685%u9753%u6626%u624E%u6704%u4E87%u7122%u907B%u61BF%uFF0D%3Dq%3F%u5983%u5C72%u5CA2%u4E0B%u90A4%u8F2B%u975D%u975D%u7685%u6F00%u6709%u3003%3Dcs%3F%3Dcs%3F%u5E2E%u6156%u84CA%u2028%u7122%u6029%u7685%u9753%u6626%23%3C%0E%0Bufyu%5Cj%2C%2C%5E%3E%23%u5358%u65BA%u670A%u4F74%u4EBB%21%u7D56%u4E17%u800D%u7369%u7ACC%3Dq%3F%u4E01%u9868%u50BF%u4EBB%u57CF%21%u518E%u9868%u50BF%u4EBB%u570C%23%3C%0E%0Bufyu%5Cj%2C%2C%5E%21%3E%21%23%uFF5F%uFF5F%21%u3001%u4E01%u6B22%u7685%u651D%u624C%3Dq%3F%21%u3001%21%21%21%21%21%21%21%21%21%21%21%21%21%21%21%21%21%21%21%21%21%21%21%21%21%21%21%21%21%u3001%21%21%21%21%u4E01%u7520%u7685%u8A94%u7D05%u3001%uFF5F%uFF5F%23%3C%0E%0Bufyu%5Cj%2C%2C%5E%21%3E%23%u6212%u66FF%u8E10%u6709%u800D%u53BC%21%u53EB%u56E1%u4F61%u5729%u5C72%u4E2E%3Dq%3F%u800D%u5729%u4ECB%u591D%u8A35%u8AAB%u8458%u7685%u71B2%u6DDB%u88D0%3Dcs%3F%u7337%u898C%u4F61%u5FAF%u7B12%u7685%u9763%u5BBA%3Dq%3F%u53E3%u5C72%u6698%u6698%21%u6212%u83F0%u5E75%u5DF3%u901E%3Dq%3F%u60F4%u6798%u4E2E%u6B22%u6B22%u56DF%u6626%21%u4F9E%u7137%3Dq%3F%u6704%u670A%u5F38%u5066%u7685%u4F61%21%u633E%u6212%u62FF%u7D1B%u800D%u4E0B%3Dq%3F%u800D%u6709%u8273%u5983%u6C35%21%u82B4%u834A%u6DD3%u8FF8%23%3C%0E%0Bufyu%5Cj%2C%2C%5E%21%3E%21%23%u5145%u5F20%u6630%u5149%u592A%u7685%u670C%u53CC%uFF0D%3Dq%3F%u670C%u53CC%u6630%u5F8D%u592A%u7685%u5145%u5F20/%23%3C%0E%0Bufyu%5Cj%2C%2C%5E%21%3E%21%23%u611C%u7685%u53CE%u9763%u4E0E%u6630%u4EC8%u6069%uFF0D%u800D%u6630%u6F21%u4E0E%u95DD%u5FC4%uFF02%23%3C%0E%0Bufyu%5Cj%2C%2C%5E%21%3E%21%23%u5983%u4F56%u8B94%u4F61%u9048%u898C%u6212%21%21%u5729%u6212%u6701%u7F8F%u9E98%u7685%u6643%u523C%3Dq%3F%u70BB%u901A%21%21%u6212%u5DF3%u5729%u4F5C%u524E%21%u6C43%u4E87%u4E95%u767F%u5E75%21%u6C43%u7943%u8B94%u6212%u5012%u7D51%u4E01%u6BB6%u5876%u7DE4%3Dq%3F%u4F5C%u65BD%u6630%u628B%u6212%u5317%u4F5D%u4E01%u68F6%u6A3A%21%21%u9578%u5729%u4F61%u5FC6%u7D94%u7685%u8DF0%u65C2%21%3Dq%3F%u967E%u514A%u4E0C%u614F%u91CE%u7685%u958C%u6F00%u4E87%u82B2%21%21%u6736%u6736%u90FE%u6630%u6212%u524E%u4E17%u7685%u76FD%u671C%3Dq%3F%21%21%u7577%u4F61%u8D71%u8FD2%21%21%u8ACC%u4F61%u7D31%u807E%21%u90A4%u986C%u6297%u7685%u844A%u6630%u6212%u7B4A%u5F86%u7685%u71B2%u60C6%21%3Dq%3F%21%u800D%u7577%u4F61%u7D43%u65BD%u7122%u8997%u7685%u8D71%u904F%21%21%u5729%u4F61%u8EAC%u5F8D%u843E%u4E87%u4E01%u5731%u7685///%3Dq%3F%u670C%u53CC%u554B%21%21%u90A4%u4E0E%u6630%u82B2%u74E4%21%21%u6630%u6212%u51CC%u96F7%u7685%u5FC4%3Dcs%3F%3Dcs%3F%u5E2E%u6156%u84CA%u2028%u4E01%u7A1F%u958C%u82B2%u7685%u6A3A%23%3C%0E%0Bufyu%5Cj%2C%2C%5E%21%3E%21%23Esbgu%21cffst-%21opu%21qfpqmf/%23%3C%0E%0Bufyu%5Cj%2C%2C%5E%21%3E%21%23Pg%21bmm%21uif%21uijoht%21J%21mptu-%21J%21njtt%21nz%21njoe%21nptu/%23%3C%0E%0Bufyu%5Cj%2C%2C%5E%21%3E%21%23Dipptf%21xibu%21zpv%21mpwf%21///%3Dcs%3FMpwf%21xibu%21zpv%21dipptf/%23%3C%0E%0Bufyu%5Cj%2C%2C%5E%21%3E%21%23Svmft%21bsf%21nbef%21up%21cf%21csplfo/%23%3C%0E%0Bufyu%5Cj%2C%2C%5E%21%3E%21%23Xbtuf%21cboexjeui%3C%21opu%21usfft%22%23%3C%0E%0Bufyu%5Cj%2C%2C%5E%21%3E%21%23Xpsl%21mjlf%21zpv%21epo%28u%21offe%21uif%21npofz/%3Dcs%3FMpwf%21mjlf%21zpv%28wf%21ofwfs%21cffo%21ivsu/%3Dcs%3FEbodf%21mjlf%21opcpez%28t%21xbudijoh/%23%3C%0E%0Bufyu%5Cj%2C%2C%5E%21%3E%21%23%u66FF%u7D94%u6EC5%u6D78%u96E4%u70BB%u6C35%uFF0D%3Dcs%3F%u9665%u537C%u5DEC%u5C72%u4E0E%u6630%u96F3%u3003%3Dcs%3F%u53D7%u6B22%u82B2%u53E3%u61F7%u8FF5%u9868%uFF0D%3Dcs%3F%u534B%u7DE4%u4FEF%u9054%u534B%u7DE4%u541C%u3003%3Dcs%3F%3Dcs%3F%u5144%u7A3A%u2028%u96E3%u601E%23%3C%0E%0B%21%0E%0Bjoefy%21%3E%21Nbui/gmpps%29Nbui/sboepn%29*+ufyu/mfohui*%3C%0A%0A00%21%u4EE6%u4E83%u6579%u8A2E%u5B9B%u53E6%u5B51%u7685%u7D23%u5F16%u503D%0E%0Bepdvnfou/xsjuf%29%23%3DDFOUFS%3F%3Dubcmf%21cpsefs%3E3%21dfmmqbeejoh%3E31%21chdpmps%3Exijuf%3F%23*%3C%0E%0Bepdvnfou/xsjuf%29%23%3Dus%3F%3Due%3F%3Dc%3F%3Dgpou%21tj%7Bf%3E%2C3%21gbdf%3E%5D%23%u6A1A%u6978%u9AD5-Ifmwfujdbm-Bsjbm%5D%23%21dpmps%3E%24519191%3F%23*%3C%0E%0Bepdvnfou/xsjuf%29ufyu%5Cjoefy%5E*%3C%0E%0Bepdvnfou/xsjuf%29%23%3D0gpou%3F%3D0c%3F%3D0ue%3F%3D0us%3F%3D0ubcmf%3F%3D0DFOUFS%3F%23*%3C"), -1));
</script>

<hr>
</body>
</html>

產生上述程式碼的流程可以說明如下:

  1. 先撰寫未加密的原始網頁。(本例為 randomText.htm
  2. 利用 shiftEncodeTest01.htm 來進行 shiftEncode() 及 escape() 的編碼。
  3. 將編碼後的字串拷貝到加密後的網頁,但必須經由 unescape() 及 shiftEncode() 來轉回原來的程式字串,再經由 eval() 來執行之。然後就大功告成了。
在上述說明中,我們使用了一個好用的網頁來對 JavaScript 程式碼進行 shiftEncode() 及 escape() 編碼:

Example(shiftEncodeTest01.htm):

上述範例的原始檔如下:

原始檔(shiftEncodeTest01.htm):(灰色區域按兩下即可拷貝)
<html>
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=big5">
</head>

<body>
<h2 align=center>使用 shiftEncode()、escape() 與 unescape() 來編碼與解碼</h2>
<hr>

<script src=encode.js></script>
<p>原字串:<textarea rows=3 cols=60 id=text1>
function square(x){
	return(x*x);
}
</textarea><br>
   Offset: <input type=text id=keyStr value="1">
<p><input type=button value="使用 shiftEncode() 與 escape() 進行編碼" onClick="text2.value=escape(shiftEncode(text1.value, parseInt(keyStr.value)))">
<br>編碼後字串:<textarea rows=3 cols=60 id=text2></textarea>
<p><input type=button value="使用 unescape() 與 shiftEncode() 進行解碼" onClick="text3.value=shiftEncode(unescape(text2.value), -parseInt(keyStr.value))">
<br>解碼後字串:<textarea rows=3 cols=60 id=text3></textarea>

<hr>
</body>
</html>

在上一個範例中,經由 shiftEncode() 及 escape() 編碼後,你還是可以由編碼後的字串看到諸如「gvodujpo」等平移過後的 ASCII 字元,若要完全避開這些字元,可將將程式碼進行「XOR編碼」(XOR Encoding),再進行 escape 編碼,範例如下:

Example(xorEncode01.htm):

上述範例仍是「每日一句」,原始碼更加凌亂,如下:

原始檔(xorEncode01.htm):(灰色區域按兩下即可拷貝)
<html>
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=big5">
</head>

<body>
<h2 align=center>保護網頁內容:以 escape() 來加密</h2>
<hr>

<script src=encode.js></script>
<script>
eval(xorEncode(unescape("%u7D9C%u78D9%u827F%u8997%u789C%u7DD5%u789C%u8269%u8986%u78CB%u7DC8%u78FD%u8275%u8991%u78DD%u7D91%u7894%u822E%u89D8%u78B1%u7DE2%u78D5%u8227%u89DE%u789C%u7DD8%u7887%u820A%u89E9%u78C8%u7D8D%u78C4%u8273%u89B8%u78D5%u7DC3%u7897%u825A%u89DE%u789E%u7DA1%u78DA%u8227%u899A%u78D3%u7D9D%u789C%u8263%u898C%u78D2%u7DCF%u78C8%u8227%u8990%u78D9%u7D9C%u789C%u8266%u8990%u78D5%u7D8C%u78D9%u8227%u8997%u78D5%u7D85%u78D9%u8227%u8985%u78D3%u7D9A%u789C%u8262%u899B%u78D9%u7D9A%u78DF%u826E%u8990%u78D9%u7DC4%u7880%u8265%u8991%u7882%u7D91%u78D3%u8272%u89C4%u78D0%u7D84%u789C%u8274%u8986%u78C8%u7DC8%u78DD%u8274%u898A%u78D8%u7D8D%u789C%u8273%u898A%u78D1%u7D8D%u789C%u8261%u898C%u78CE%u7DC8%u78D5%u826B%u898F%u78D2%u7D8D%u78CF%u8274%u89CD%u789E%u7DD3%u78B1%u820D%u8997%u78D9%u7D90%u78C8%u825C%u898A%u7897%u7DC3%u78E1%u823A%u89C1%u36B1%u0649%u37DC%uD216%uFF1B%u19A7%u0B6C%u1EFE%u1794%uEEEA%u21A6%uE89F%u1AAA%uDB1D%uFE0E%u87B0%u7DD4%u78CC%u8239%u0B06%u37DC%u2DF9%uF841%uDBCC%uF4A1%u1617%u1A3C%u2F8C%uF4FF%uD666%u87B0%u7DD4%u78CC%u8239%u1940%uE600%u82E4%u1AFC%uE50E%uFF67%u1EFE%u2FD3%uE841%uDE00%uEFCC%u36BC%u07C6%u099D%uF652%uFF67%u0732%uE37F%u87B0%u823B%u8993%u7882%uFF0D%u36B1%uDD90%uC7EE%u2ABA%uEB0A%u87B0%uCC58b%u21C1%u2495%u0E38%u08AD%u0991%u2931%uF463%u87B0%u823B%u8993%u7882%u33B7%uF13D%uD52F%uD620%uF05D%u26B0%uFCEB%uE318%u02FE%u87B0%u7DD4%u78CC%u8239%uE8FC%uF3A1%u333E%u05DA%uCC81%uC683%u36BC%u3315%uF2A4%uE3B1%uB9E1%u7880%u7D8A%u78CE%u8239%u89DF%u78DE%u7D9A%u7882%u1770%uD0C4%u363A%u330D%u2730%u7D0B%uC683%u1AF1%u1AEB%u0F59%u1254%u76EF%u7880%u7D98%u7882%uD52F%u13A3%u098A%u2B36%uE12A%uF483%uDBAD%uE81F%u82E4%u7880%u8277%u89DD%u142E%u1AE1%u1894%uE26F%uFF67%uEFEE%u1BCD%u1AF1%uE504%uC765%u099D%uED92%u1902%u7D0B%u89DF%u78CC%u7DD6%u213E%uDE76%uD542%u36B6%uED4B%uF796%u155B%u1EBF%u0E38%u1317%u1FB4%uB205%u89DF%u78DE%u7D9A%u7882%u823B%u8981%u78CE%u7DD6%u2691%uE352%u0D2A%u589B%u0CC9%u1894%uF483%u1EB1%u1E99%u7DCA%u7887%u820A%u89E9%u78C8%u7D8D%u78C4%u8273%u89B8%u78D5%u7DC3%u7897%u825A%u89DE%u789E%u2EBF%u1D05%uE50E%uC690%u3606%u7DC8%u05E9%uCC11%u09EF%u0BD4%u0723%u7880%u8277%u89DD%u36BC%uE58F%u2802%uCCBD%uDE2D%u789C%u2C65%uE0DB%uD2B9%uC759%u2FB7%u7DCA%u7887%u820A%u89E9%u78C8%u7D8D%u78C4%u8273%u89B8%u78D5%u7DC3%u7897%u825A%u89C3%u7881%u7DC8%u789E%u7D59%u76BD%u789C%u4DE8%u36BC%uE926%uFF67%u1DA0%u1FA3%u7880%u8277%u89DD%u789C%u4DE8%u789C%u8227%u89C3%u789C%u7DC8%u789C%u8227%u89C3%u789C%u7DC8%u789C%u8227%u89C3%u789C%u7DC8%u789C%u8227%u89C3%u789C%u7DC8%u789C%u8227%u89C3%u789C%u7DC8%u789C%u8227%u89C3%u789C%u4DE8%u789C%u8227%u89C3%u789C%u33E8%u0DA3%uF483%u0370%u05B8%u4DE8%u87E2%u7D59%u89C1%u7887%u7DE5%u78B6%u8273%u8986%u78C4%u7D9C%u78E7%u826E%u89C8%u7897%u7DB5%u789C%u823A%u89C1%u1AAD%u1B16%uF6B3%uE50F%u09EF%u2B07%u7DC8%u2B56%uD4E7%uC683%u2F94%u2199%u3691%u823B%u8993%u7882%uFDE4%u2F94%uCCCD%uD0FF%uF288%uF742%uFCEB%uF483%uF852%u1566%uF527%u7880%u8265%u8991%u7882%u0EDE%uF137%uCD67%uD64D%u03AD%u0B6C%uEFDE%uD9BE%u89DF%u78CC%u7DD6%u2B5E%uDE76%uEF74%u1E2B%u7DC8%u1AAD%u01E8%uD797%u254E%uEDF5%u7880%u8277%u89DD%u184F%u1A7F%u3691%uE926%uE2C2%u2E62%u1BCD%u789C%uCD9A%uF8D5%u7880%u7D98%u7882%uE504%uEEEA%u278B%u2D8D%u0E38%uCD67%u89C3%u1B81%u1FF9%u1A42%uFF1D%u09EF%u36B6%u7DD4%u78CC%u8239%u09EF%u1FB4%uFF9A%u213E%uEE33%u89C3%uFA0F%uFEA1%u156E%u0DF0%u89C1%u7887%u7DE5%u78B6%u8273%u8986%u78C4%u7D9C%u78E7%u826E%u89C8%u7897%u7DB5%u789C%u823A%u89C3%u789E%u2CAC%u27A3%uE428%uD8AB%u2195%u0B6C%u1FB7%uD1CC%u76EF%u7880%u7D98%u7882%uE50C%uDA28%u1E93%u2264%u2195%uF483%uD8A7%u27A3%u7DC6%u789E%u823C%u89EE%u78B6%u7D9C%u78D9%u827F%u8997%u78E7%u7D81%u7897%u822C%u89BE%u789C%u7DD5%u789C%u8225%uE8F8%u0E38%u2E25%uEFDE%uCC0A%uEFCC%u367B%u1D80%u87B0%u020B%uEFCC%u179C%u33E5%uED60%uDDC4%u76E2%u789E%u7DD3%u78B1%u820D%u8997%u78D9%u7D90%u78C8%u825C%u898A%u7897%u7DC3%u78E1%u8227%u89DE%u789C%u7DCA%u213E%uCD52%u0270%u37DC%uEDAF%uF137%uE016%u89C3%u789C%u2AC0%u1AAD%uE507%uF66D%uE62B%u0B6C%u1EFE%uD03C%u89DF%u78CC%u7DD6%u0806%u121E%u89C3%u789C%u1FF9%u254E%uD52F%uC6B8%u2AF1%u7DC8%u14FE%uCC81%uC777%u0EC2%u239C%u789C%uEE45%uF0A1%uF32F%u1FF9%u28AD%uFF57%uC7E3%u1309%u259D%u055F%u823B%u8993%u7882%u32B3%u1D00%uE428%uEB69%u1AAD%u2EFE%u37E0%uCC07%uE116%u1285%u7DC8%u789C%u1770%uDECB%u37DC%u222D%u052F%uF483%u040C%u1D7D%u7DC8%u7880%u8277%u89DD%uEEC1%u2CA1%u36B7%uE349%u182E%u0E38%uE863%u1643%uCC81%u0B52%u789C%u7DC8%u1F89%uE532%u191E%u1E93%u1FF9%u2AF1%uCC11%uFF67%u0E40%u1AF3%u7880%u8277%u89DD%u789C%u7DC8%u0DCA%uCD67%u0493%uF76D%u7DC8%u789C%u08CC%uC683%u058C%uFD95%u789C%u12A4%u1188%u1A2A%u0B6C%uFCF5%uE428%uEBF2%u03F5%u226D%u0E38%uF3B6%uE926%u789C%u7DD4%u78CC%u8239%u89C3%uF8B0%u089E%u37DC%uFF45%uEC5F%u099D%uF47E%u0E38%u0F77%u19AD%u789C%u7DC8%u2F94%uCD67%u0748%u2730%uF9D5%u363A%uCC07%uDED3%u0E38%u7DC6%u7892%u8229%u89DF%u78CC%u7DD6%u1FB7%uD1CC%uDCA9%u789C%u7DC8%uE81F%uCC0A%uEFCC%uFA0D%u090B%u789C%u8227%uEFCC%u1AAD%u2C23%uEE4A%uF483%uD620%u7880%u7D8A%u78CE%u8239%u89DF%u78DE%u7D9A%u7882%uDC2A%uE8B6%uFC75%u5DCF%u36BC%uF819%u1C68%uFA0D%u0B6C%u1285%u8225%u89D8%u78B1%u7DE2%u78C8%u8262%u899B%u78C8%u7DB3%u78D5%u822C%u89C8%u78E1%u7DC8%u7881%u8227%u89C1%u78F8%u7D9A%u78DD%u8261%u8997%u789C%u7D8A%u78D9%u8262%u8991%u78CF%u7DC4%u789C%u8269%u898C%u78C8%u7DC8%u78CC%u8262%u898C%u78CC%u7D84%u78D9%u8229%u89C1%u7887%u7DE5%u78B6%u8273%u8986%u78C4%u7D9C%u78E7%u826E%u89C8%u7897%u7DB5%u789C%u823A%u89C3%u789E%u7DA7%u78DA%u8227%u8982%u78D0%u7D84%u789C%u8273%u898B%u78D9%u7DC8%u78C8%u826F%u898A%u78D2%u7D8F%u78CF%u8227%u89AA%u789C%u7D84%u78D3%u8274%u8997%u7890%u7DC8%u78F5%u8227%u898E%u78D5%u7D9B%u78CF%u8227%u898E%u78C5%u7DC8%u78D1%u826E%u898D%u78D8%u7DC8%u78D1%u8268%u8990%u78C8%u7DC6%u789E%u823C%u89EE%u78B6%u7D9C%u78D9%u827F%u8997%u78E7%u7D81%u7897%u822C%u89BE%u789C%u7DD5%u789C%u8225%u89A0%u78D4%u7D87%u78D3%u8274%u8986%u789C%u7D9F%u78D4%u8266%u8997%u789C%u7D91%u78D3%u8272%u89C3%u78D0%u7D87%u78CA%u8262%u89C3%u7892%u7DC6%u7892%u823B%u8981%u78CE%u7DD6%u78F0%u8268%u8995%u78D9%u7DC8%u78CB%u826F%u8982%u78C8%u7DC8%u78C5%u8268%u8996%u789C%u7D8B%u78D4%u8268%u898C%u78CF%u7D8D%u7892%u8225%u89D8%u78B1%u7DE2%u78C8%u8262%u899B%u78C8%u7DB3%u78D5%u822C%u89C8%u78E1%u7DC8%u7881%u8227%u89C1%u78EE%u7D9D%u78D0%u8262%u8990%u789C%u7D89%u78CE%u8262%u89C3%u78D1%u7D89%u78D8%u8262%u89C3%u78C8%u7D87%u789C%u8265%u8986%u789C%u7D8A%u78CE%u8268%u8988%u78D9%u7D86%u7892%u8225%u89D8%u78B1%u7DE2%u78C8%u8262%u899B%u78C8%u7DB3%u78D5%u822C%u89C8%u78E1%u7DC8%u7881%u8227%u89C1%u78EB%u7D89%u78CF%u8273%u8986%u789C%u7D8A%u78DD%u8269%u8987%u78CB%u7D81%u78D8%u8273%u898B%u7887%u7DC8%u78D2%u8268%u8997%u789C%u7D9C%u78CE%u8262%u8986%u78CF%u7DC9%u789E%u823C%u89EE%u78B6%u7D9C%u78D9%u827F%u8997%u78E7%u7D81%u7897%u822C%u89BE%u789C%u7DD5%u789C%u8225%u89B4%u78D3%u7D9A%u78D7%u8227%u898F%u78D5%u7D83%u78D9%u8227%u899A%u78D3%u7D9D%u789C%u8263%u898C%u78D2%u7DCF%u78C8%u8227%u898D%u78D9%u7D8D%u78D8%u8227%u8997%u78D4%u7D8D%u789C%u826A%u898C%u78D2%u7D8D%u78C5%u8229%u89DF%u78DE%u7D9A%u7882%u824B%u898C%u78CA%u7D8D%u789C%u826B%u898A%u78D7%u7D8D%u789C%u827E%u898C%u78C9%u7DCF%u78CA%u8262%u89C3%u78D2%u7D8D%u78CA%u8262%u8991%u789C%u7D8A%u78D9%u8262%u898D%u789C%u7D80%u78C9%u8275%u8997%u7892%u7DD4%u78DE%u8275%u89DD%u78F8%u7D89%u78D2%u8264%u8986%u789C%u7D84%u78D5%u826C%u8986%u789C%u7D86%u78D3%u8265%u898C%u78D8%u7D91%u789B%u8274%u89C3%u78CB%u7D89%u78C8%u8264%u898B%u78D5%u7D86%u78DB%u8229%u89C1%u7887%u7DE5%u78B6%u8273%u8986%u78C4%u7D9C%u78E7%u826E%u89C8%u7897%u7DB5%u789C%u823A%u89C3%u789E%u1B16%u052F%uECC3%uE494%uEE5F%u0D52%u1488%u7D0B%u89DF%u78DE%u7D9A%u7882%u1463%uDA98%u2557%u2199%u36B1%uE428%u1F11%u48BE%u7DD4%u78DE%u8275%u89DD%u2B6A%u16C9%uFA0D%uD1E5%uE815%uF748%uE58F%u87B0%u823B%u8981%u78CE%u7DD6%u2BF6%uFFE4%uC60D%uE8EF%u2EA2%u055F%uD61C%uB9E1%u7880%u7D8A%u78CE%u8239%u89DF%u78DE%u7D9A%u7882%uD344%uF3DA%u589B%uEB0A%u18A1%u8225%u89D8%u78B1%u7DE2%u789C%u820A%u89E9%u78D5%u7D86%u78D8%u8262%u899B%u789C%u7DD5%u789C%u824A%u8982%u78C8%u7D80%u7892%u8261%u898F%u78D3%u7D87%u78CE%u822F%u89AE%u78DD%u7D9C%u78D4%u8229%u8991%u78DD%u7D86%u78D8%u8268%u898E%u7894%u7DC1%u7896%u8273%u8986%u78C4%u7D9C%u7892%u826B%u8986%u78D2%u7D8F%u78C8%u826F%u89CA%u7887%u7DE1%u78B5%u8228%u89CC%u789C%u330D%u363E%uE77F%u03CE%u2326%u2E0D%u23EC%uF483%uF4C1%u27A9%u2DD4%u78B1%u820D%u8987%u78D3%u7D8B%u78C9%u826A%u8986%u78D2%u7D9C%u7892%u8270%u8991%u78D5%u7D9C%u78D9%u822F%u89C1%u7880%u7DAB%u78F9%u8249%u89B7%u78F9%u7DBA%u7882%u823B%u8997%u78DD%u7D8A%u78D0%u8262%u89C3%u78DE%u7D87%u78CE%u8263%u8986%u78CE%u7DD5%u788E%u8227%u8980%u78D9%u7D84%u78D0%u8277%u8982%u78D8%u7D8C%u78D5%u8269%u8984%u7881%u7DDA%u788C%u8227%u8981%u78DB%u7D8B%u78D3%u826B%u898C%u78CE%u7DD5%u78CB%u826F%u898A%u78C8%u7D8D%u7882%u8225%u89CA%u7887%u7DE5%u78B6%u8263%u898C%u78DF%u7D9D%u78D1%u8262%u898D%u78C8%u7DC6%u78CB%u8275%u898A%u78C8%u7D8D%u7894%u8225%u89DF%u78C8%u7D9A%u7882%u823B%u8997%u78D8%u7DD6%u7880%u8265%u89DD%u7880%u7D8E%u78D3%u8269%u8997%u789C%u7D9B%u78D5%u827D%u8986%u7881%u7DC3%u788E%u8227%u8985%u78DD%u7D8B%u78D9%u823A%u89BF%u789E%u17F1%u11CB%u18D3%u89CF%u78F4%u7D8D%u78D0%u8271%u8986%u78C8%u7D81%u78DF%u8266%u898F%u7890%u7DA9%u78CE%u826E%u8982%u78D0%u7DB4%u789E%u8227%u8980%u78D3%u7D84%u78D3%u8275%u89DE%u789F%u7DDC%u788C%u823F%u89D3%u7884%u7DD8%u7882%u8225%u89CA%u7887%u7DE5%u78B6%u8263%u898C%u78DF%u7D9D%u78D1%u8262%u898D%u78C8%u7DC6%u78CB%u8275%u898A%u78C8%u7D8D%u7894%u8273%u8986%u78C4%u7D9C%u78E7%u826E%u898D%u78D8%u7D8D%u78C4%u825A%u89CA%u7887%u7DE5%u78B6%u8263%u898C%u78DF%u7D9D%u78D1%u8262%u898D%u78C8%u7DC6%u78CB%u8275%u898A%u78C8%u7D8D%u7894%u8225%u89DF%u7893%u7D8E%u78D3%u8269%u8997%u7882%u7DD4%u7893%u8265%u89DD%u7880%u7DC7%u78C8%u8263%u89DD%u7880%u7DC7%u78C8%u8275%u89DD%u7880%u7DC7%u78C8%u8266%u8981%u78D0%u7D8D%u7882%u823B%u89CC%u78FF%u7DAD%u78F2%u8253%u89A6%u78EE%u7DD6%u789E%u822E%u89D8"), "編碼與解碼"));
</script>

<hr>
</body>
</html>

產生上述程式碼的流程可以說明如下:

  1. 先撰寫未加密的原始網頁。(本例為 randomText.htm
  2. 利用 xorEncodeTest01.htm 來進行 xorEncode() 及 escape() 的編碼。
  3. 將編碼後的字串拷貝到加密後的網頁,但必須經由 unescape() 及 xorEncode() 來轉回原來的程式字串,再經由 eval() 來執行之。然後就大功告成了。
在上述說明中,我們使用了一個好用的網頁來對 JavaScript 程式碼進行 xorEncode() 及 escape() 編碼:

Example(xorEncodeTest01.htm):

上述範例的原始檔如下:

原始檔(xorEncodeTest01.htm):(灰色區域按兩下即可拷貝)
<html>
<head>
<meta HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=big5">
</head>

<body>
<h2 align=center>使用 xorEncode()、escape() 與 unescape() 來編碼與解碼</h2>
<hr>

<script src=encode.js></script>
<p>原字串:<textarea rows=3 cols=60 id=text1>
function square(x){
	return(x*x);
}
</textarea><br>
   key string: <input type=text id=keyStr value="編碼與解碼">
<p><input type=button value="使用 xorEncode 與 escape() 進行編碼" onClick="text2.value=escape(xorEncode(text1.value, keyStr.value))">
<br>編碼後字串:<textarea rows=3 cols=60 id=text2></textarea>
<p><input type=button value="使用 unescape() 與 xorEncode() 進行解碼" onClick="text3.value=xorEncode(unescape(text2.value), keyStr.value)">
<br>解碼後字串:<textarea rows=3 cols=60 id=text3></textarea>

<hr>
</body>
</html>

而 shiftEncode() 及 xorEncode() 則定義於 encode.js,如下:

原始檔(encode.js):(灰色區域按兩下即可拷貝)
// 各種編碼與解碼的函數
function shiftEncode(inputStr, offset){
	var encoded, outputStr="";
	for (var i=0; i<inputStr.length; i++){
		encoded=inputStr.charCodeAt(i)+offset;
		outputStr += String.fromCharCode(encoded);
	}
	return(outputStr);
}

function xorEncode(inputStr, keyStr){
	var outputStr="";
	var j=0;
	for (var i=0; i<inputStr.length; i++){
		encoded=inputStr.charCodeAt(i) ^ keyStr.charCodeAt(j++);
		if (j==keyStr.length)
			j -= keyStr.length;
		outputStr += String.fromCharCode(encoded);
	}
	return(outputStr);
}

有關於本節所介紹的編碼與解碼的方法,可以列表如下:

相關函數編碼方式解碼方式
escape() 和 unescape()escape(原字串)unscape(編碼後字串)
shiftEncode()shiftEncode(原字串, 平移量)shiftEncode(編碼後字串, -平移量)
xorEncode()xorEncode(原字串, XOR字串)xorEncode(編碼後字串, XOR字串)

當然嘍,同學們還可以想出更複雜的編碼與解碼函式,來保護你的程式碼。但是這些保護方式,還是只防君子,不防小人,因為對於功力高深的有心人來說,還是可以抽絲剝繭地慢慢破解你的編碼過程。

Hint
若要查詢其他 JavaScript 程式碼隱藏的方法,可到 Google 查詢「javascript obfuscator」。


JavaScript 程式設計與應用:用於網頁用戶端